<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0"/>
<title>网友Nicky分享商品动画飞入购物车效果</title>
<link href="css/select.css" rel="stylesheet" type="text/css" />
</head>

<body>
<center>
  <span style="font-size:15px; font-weight:bold; text-align:center; line-height:25px; color:#000; width:100%">网友Nicky分享商品动画飞入购物车效果<br />
     <a href="http://www.jq-school.com" target="_blank" style="color:#000">JquerySchool</a>网站出品（<a href="http://www.jq-school.com" style="color:#000" target="_blank">http://www.jq-school.com</a>）<br />
	 <a href="http://www.chinacoder.cn/" target="_blank" style="color:#000">IT码农</a>（<a href="http://www.chinacoder.cn/" target="_blank" style="color:#000">http://www.chinacoder.cn/</a>）<br />
	   （<a href="http://bbs.jq-school.com" target="_blank" style="color:#000">Jquery学堂交流社区</a>）	
	  <br />
      <a target="_blank" href="http://wp.qq.com/wpa/qunwpa?idkey=f221dd676cd5f7f51f6b580ff8fe1bdd2fefe911ae0e1137a6f79c58d6e11ebf">官方网站学习交流QQ群<img border="0" src="http://pub.idqqimg.com/wpa/images/group.png" style="width:90px; height:22px;" alt="Jquery学堂QQ⑧群" width="90" height="22" title="Jquery学堂QQ⑧群"></a></span>
</center>


<!--M-main-->
<div id="M-main">
	<div class="M-main-t">
  </div>
    <div id="M-main-b">
    	<div class="M-main-list">
        	<div class="M-main-A left">
            	<div class="M-main-A-a">
                	<a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/"><img src="images/pro1.jpg" width="65" height="65" alt="asd" /></a>
                    <span class="M-list-color-1"></span>
                </div>
                <div class="M-main-A-b">
                	<h3><a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/">彩涂板卷(镀铝锌基板)</a><em class="baseBg ico1"></em></h3>
                    <p>chinacoder 白色 聚酯 2/1 50/50</p>
                    <p>宝钢股份</p>
                </div>
            </div>
            <div class="M-main-B left">
                <p class="num">0.6*1000*C</p>
                <p><span>5.000</span>吨</p>
            </div>
            <div class="M-main-C left">
            	<p>类似资源共189吨</p>
                <p><a href="#" title="立刻过滤">立刻过滤</a></p>
            </div>
            <div class="M-main-D left">
            	<em class="baseBg YI-img"></em>
            	<p>&yen;<del>8700.00</del>元/吨</p>
                <p>&yen;<span>6200</span>元/吨</p>
            </div>
            <div class="M-main-E left">
            	<a href="###" title="加入购物车" class="baseBg Q-buy-btn" id="buy-s-1">加入购物车</a>
                <p><span class="attention-btn">关注此类资源</span></p>
            </div>
        </div>
    	<div class="M-main-list">
        	<div class="M-main-A left">
            	<div class="M-main-A-a">
                	<a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/"><img src="images/pro1.jpg" width="65" height="65" alt="asd" /></a>
                    <span class="M-list-color-1"></span>
                </div>
                <div class="M-main-A-b">
                	<h3><a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/">彩涂板卷(镀铝锌基板)</a><em class="baseBg ico1"></em></h3>
                    <p>chinacoder 白色 聚酯 2/1 50/50</p>
                    <p>宝钢股份</p>
                </div>
            </div>
            <div class="M-main-B left">
                <p class="num">0.6*1000*C</p>
                <p><span>5.000</span>吨</p>
            </div>
            <div class="M-main-C left">
            	<p>类似资源共189吨</p>
                <p><a href="#" title="立刻过滤">立刻过滤</a></p>
            </div>
            <div class="M-main-D left">
            	<em class="baseBg YI-img"></em>
            	<p>&yen;<del>8700.00</del>元/吨</p>
                <p>&yen;<span>6200</span>元/吨</p>
            </div>
            <div class="M-main-E left">
            	<a href="###" title="加入购物车" class="baseBg Q-buy-btn" id="buy-s-1">加入购物车</a>
                <p><span class="attention-btn">关注此类资源</span></p>
            </div>
        </div>
    	<div class="M-main-list">
        	<div class="M-main-A left">
            	<div class="M-main-A-a">
                	<a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/"><img src="images/pro1.jpg" width="65" height="65" alt="asd" /></a>
                    <span class="M-list-color-1"></span>
                </div>
                <div class="M-main-A-b">
                	<h3><a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/">彩涂板卷(镀铝锌基板)</a><em class="baseBg ico1"></em></h3>
                    <p>chinacoder 白色 聚酯 2/1 50/50</p>
                    <p>宝钢股份</p>
                </div>
            </div>
            <div class="M-main-B left">
                <p class="num">0.6*1000*C</p>
                <p><span>5.000</span>吨</p>
            </div>
            <div class="M-main-C left">
            	<p>类似资源共189吨</p>
                <p><a href="#" title="立刻过滤">立刻过滤</a></p>
            </div>
            <div class="M-main-D left">
            	<em class="baseBg YI-img"></em>
            	<p>&yen;<del>8700.00</del>元/吨</p>
                <p>&yen;<span>6200</span>元/吨</p>
            </div>
            <div class="M-main-E left">
            	<a href="###" title="加入购物车" class="baseBg Q-buy-btn" id="buy-s-1">加入购物车</a>
                <p><span class="attention-btn">关注此类资源</span></p>
            </div>
        </div>
    	<div class="M-main-list">
        	<div class="M-main-A left">
            	<div class="M-main-A-a">
                	<a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/"><img src="images/pro1.jpg" width="65" height="65" alt="asd" /></a>
                    <span class="M-list-color-1"></span>
                </div>
                <div class="M-main-A-b">
                	<h3><a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/">彩涂板卷(镀铝锌基板)</a><em class="baseBg ico1"></em></h3>
                    <p>chinacoder 白色 聚酯 2/1 50/50</p>
                    <p>宝钢股份</p>
                </div>
            </div>
            <div class="M-main-B left">
                <p class="num">0.6*1000*C</p>
                <p><span>5.000</span>吨</p>
            </div>
            <div class="M-main-C left">
            	<p>类似资源共189吨</p>
                <p><a href="#" title="立刻过滤">立刻过滤</a></p>
            </div>
            <div class="M-main-D left">
            	<em class="baseBg YI-img"></em>
            	<p>&yen;<del>8700.00</del>元/吨</p>
                <p>&yen;<span>6200</span>元/吨</p>
            </div>
            <div class="M-main-E left">
            	<a href="###" title="加入购物车" class="baseBg Q-buy-btn" id="buy-s-1">加入购物车</a>
                <p><span class="attention-btn">关注此类资源</span></p>
            </div>
        </div>
    	<div class="M-main-list">
        	<div class="M-main-A left">
            	<div class="M-main-A-a">
                	<a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/"><img src="images/pro1.jpg" width="65" height="65" alt="asd" /></a>
                    <span class="M-list-color-1"></span>
                </div>
                <div class="M-main-A-b">
                	<h3><a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/">彩涂板卷(镀铝锌基板)</a><em class="baseBg ico1"></em></h3>
                    <p>chinacoder 白色 聚酯 2/1 50/50</p>
                    <p>宝钢股份</p>
                </div>
            </div>
            <div class="M-main-B left">
                <p class="num">0.6*1000*C</p>
                <p><span>5.000</span>吨</p>
            </div>
            <div class="M-main-C left">
            	<p>类似资源共189吨</p>
                <p><a href="#" title="立刻过滤">立刻过滤</a></p>
            </div>
            <div class="M-main-D left">
            	<em class="baseBg YI-img"></em>
            	<p>&yen;<del>8700.00</del>元/吨</p>
                <p>&yen;<span>6200</span>元/吨</p>
            </div>
            <div class="M-main-E left">
            	<a href="###" title="加入购物车" class="baseBg Q-buy-btn" id="buy-s-1">加入购物车</a>
                <p><span class="attention-btn">关注此类资源</span></p>
            </div>
        </div>
    	<div class="M-main-list">
        	<div class="M-main-A left">
            	<div class="M-main-A-a">
                	<a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/"><img src="images/pro1.jpg" width="65" height="65" alt="asd" /></a>
                    <span class="M-list-color-1"></span>
                </div>
                <div class="M-main-A-b">
                	<h3><a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/">彩涂板卷(镀铝锌基板)</a><em class="baseBg ico1"></em></h3>
                    <p>chinacoder 白色 聚酯 2/1 50/50</p>
                    <p>宝钢股份</p>
                </div>
            </div>
            <div class="M-main-B left">
                <p class="num">0.6*1000*C</p>
                <p><span>5.000</span>吨</p>
            </div>
            <div class="M-main-C left">
            	<p>类似资源共189吨</p>
                <p><a href="#" title="立刻过滤">立刻过滤</a></p>
            </div>
            <div class="M-main-D left">
            	<em class="baseBg YI-img"></em>
            	<p>&yen;<del>8700.00</del>元/吨</p>
                <p>&yen;<span>6200</span>元/吨</p>
            </div>
            <div class="M-main-E left">
            	<a href="###" title="加入购物车" class="baseBg Q-buy-btn" id="buy-s-1">加入购物车</a>
                <p><span class="attention-btn">关注此类资源</span></p>
            </div>
        </div>
    	<div class="M-main-list">
        	<div class="M-main-A left">
            	<div class="M-main-A-a">
                	<a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/"><img src="images/pro1.jpg" width="65" height="65" alt="asd" /></a>
                    <span class="M-list-color-1"></span>
                </div>
                <div class="M-main-A-b">
                	<h3><a href="http://www.chinacoder.cn/" title="http://www.chinacoder.cn/">彩涂板卷(镀铝锌基板)</a><em class="baseBg ico1"></em></h3>
                    <p>chinacoder 白色 聚酯 2/1 50/50</p>
                    <p>宝钢股份</p>
                </div>
            </div>
            <div class="M-main-B left">
                <p class="num">0.6*1000*C</p>
                <p><span>5.000</span>吨</p>
            </div>
            <div class="M-main-C left">
            	<p>类似资源共189吨</p>
                <p><a href="#" title="立刻过滤">立刻过滤</a></p>
            </div>
            <div class="M-main-D left">
            	<em class="baseBg YI-img"></em>
            	<p>&yen;<del>8700.00</del>元/吨</p>
                <p>&yen;<span>6200</span>元/吨</p>
            </div>
            <div class="M-main-E left">
            	<a href="###" title="加入购物车" class="baseBg Q-buy-btn" id="buy-s-1">加入购物车</a>
                <p><span class="attention-btn">关注此类资源</span></p>
            </div>
        </div>
  </div>
</div>

<!--footer-menu-->

<!--J-shoping-->
<div class="J-shoping J-shoping-small">
	<div class="J-shoping-item">
    	<a href="http://www.chinacoder.cn/" title="" id="U-attion"><em class="baseBg"></em>我关注的资源<span class="baseBg"></span></a>
        <div class="baseBg J-L-ico J-shoping-pos"></div>
        <div class="J-shoping-main">
            <div class="J-shoping-title">
                <a href="#" title="" class="J-go"><em class="baseBg"></em>购物车</a>
                <span class="baseBg J-shoping-num">0</span>
            </div>
            <div class="baseBg J-shoping-mx"></div>
            <div class="J-shoping-px"></div>
            <div class="J-shoping-body">
                <div class="J-shoping-buy"><span>最多显示最新<strong>5</strong>条</span><a class="baseBg" href="http://www.chinacoder.cn/" title="去购物车结算"></a></div>
            </div>
        </div>
        <div class="baseBg J-R-ico J-shoping-pos"></div>
    </div>
</div>
<a href="http://www.chinacoder.cn/" title="在线客服" class="baseBg Q-online"></a>



<!-- notice begin -->
<p style="width:1000px;  margin:0 auto; font-family:微软雅黑;">
一直是jquery学堂忠实粉丝，从最开始不会使用js到已经可以很轻松的写出漂亮的jquery插件，
不得不说jquery学堂给了我很大的帮助，一直忙于工作，很少有时间把自己写的插件整理分享打包给jquery学堂以供大家指正、学习。
这款插件是前段时间项目开发上写的 ，时间有点久了，上个星期看到群里有人一直在问要加入购物车animate的效果，
但是一直没人搭理，所以这款插件先分享给大家，还望大家不吝赐教 ，
个人小站刚搭建随时欢迎来访 www.chinacoder.cn  QQ:525690001，支持漫画愿jquery学堂越来越好。   
</p>
<!-- notice end -->

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jQuery-shopping.js"></script>
<script type="text/javascript" >
$(function(){
   $('.Q-buy-btn').shoping(); //调用shoping函数
})
</script>
</body>
</html>
